import Vue from "vue";
import VueRouter from "vue-router";
// 导入组件
// 如果写的是文件夹，会自动读取文件夹中的index.js
// import login from "../views/Login/index.vue"; 
const login = () => import('../views/Login/index.vue')      //使用路由懒加载
// 引入layout组件
// import layout from "../views/Layout";
const layout = () => import('../views/Layout')
// 引入tabbar四个子组件
// import home from "../views/Layout/home";
// import ask from "../views/Layout/ask";
// import video from "../views/Layout/video";
// import user from "../views/Layout/user";
// import chat from '../views/Layout/user/chat.vue'
// import edit from "../views/Layout/user/edit.vue";

const home = () => import('../views/Layout/home')
const ask = () => import('../views/Layout/ask')
const video = () => import('../views/Layout/video')
const user = () => import('../views/Layout/user')
const chat = () => import('../views/Layout/user/chat.vue')
const edit = () => import('../views/Layout/user/edit.vue')

// 导入vuex（需要用到store中state中的token）
import store from "../store";
import { Toast } from "vant";
// 搜索页面
// import Search from '../views/seach/index.vue'
// import result from '../views/seach/result.vue'
const Search = () => import('../views/seach/index.vue')
const result = () => import('../views/seach/result.vue')
// 文章详情页
// import Article from '../views/Article'
const Article = () => import('../views/Article')
// 导入404页面
// import NotFound from '../views/NotFound'
const NotFound = () => import('../views/NotFound')

Vue.use(VueRouter);

const routes = [
  {path:'/',redirect:'/home'},  //路由重定向，redirect："重定向路径"
  {
    path: "/login",
    name: login,
    component: login,
  },
  {
    path: "/layout",
    component: layout,
    children: [
      // 子路由路径加 / 那样就能直接写路径访问子路由，而不用写父路径
      { path: "/home", component: home,meta:{needKeep:true} },     //用meta 标记，home组件需要被缓存
      { path: "/ask", component: ask },
      { path: "/video", component: video },
      {
        path: "/user",
        component: user,
        meta: { needLogin: true, needUser: true },
      },
    ],
  },
  {
    path: "/user/edit",
    component: edit,
    meta: { needLogin: true, needUser: true },
  },
  {path:'/user/chat',component:chat},   //聊天机器人路由
  {path:'/NotFound',component:NotFound},  //404页面
  {path:'/Search',component:Search},      //搜索页路由
  {path:'/Search/result',component:result},  //搜索结果
  {path:'/Article',component:Article},
  {path:'*',redirect:'/NotFound'},// 匹配除了上面这些路径以外的所有路径
];

const router = new VueRouter({
  routes,
});
import {userInfo} from '../api/user'
// 路由守卫
router.beforeEach((to, from, next) => {
  // 该判断要去的页面是不是需要登录的页面
  if (to.meta.needLogin) {                      //是否需要登录状态进入
    // 如果有这个标签，代表需要登录
    // 判断它有没有登录(判断有没有token)
    // console.log('守卫里', store.state.token)
    if (store.state.token.token) {              //判断是否有token
      if (to.meta.needUser) {                    //判断跳转路由是否需要获取用户数据
        if (!store.state.userInfo.name) {          //判断是否存在用户信息数据
          // 发请求
          userInfo().then((res) => {
            // 把请求来的用户数据存到vuex里面
            store.commit("saveUserInfo", res.data.data);
          });
        }
      }
      next();
    } else {
      // 提示用户请先登录
      Toast.fail("请先登录");
      // 没登录，打回登录页
      next({
        path: "/login",
        query: {
          back: to.path, //路由传参（地址）返回登录页面
        },
      });
    }
  } else {
    // 没有这个标签的代表可以直接访问
    next();
  }
});

export default router;
